<!--
 * @Author: 刘十三
 * @Date: 2024-01-04 15:13:21
 * @LastEditors: 刘十三
 * @LastEditTime: 2024-01-10 09:39:01
 * @FilePath: \dev-1.3.1-nm\dev\pages\internal\linkage\todo\postponeProcessing.vue
 * @Description:内蒙多员联动 - 延期办理申请（列表）
-->

<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :is-white="false" :title="navTitle" :custom-back="goBack" style="z-index: 99999">
      <u-icon name="search" color="#FFF" size="38" style="margin: 0 24rpx 0 6rpx" @tap="openSearch"></u-icon>
      <u-icon name="plus" color="#FFF" size="38" style="margin: 0 24rpx 0 6rpx" @tap="handleAdd"></u-icon>
    </theme-navbar>
    <!-- #endif -->

    <!-- #ifdef H5-WECHAT -->
    <fab-button :content="fContent" @fabtrigger="fabtrigger" />
    <!-- #endif -->

    <!-- 列表 -->
    <view class="content">
      <me-table :i="0" :index="0" :top="20" :load-data="loadData" :init-load="false" ref="mescrollItem0" v-if="show">
        <template slot-scope="d">
          <u-card :showHead="false" :showFoot="false" padding="20" :border="false" margin="0">
            <postponeAccountsItem slot="body" class="n-lay" :seal-info="d.data" />
          </u-card>
          <u-gap :height="$theme.cm_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
        </template>
      </me-table>
    </view>

    <!-- 搜索条件 -->
    <u-popup v-model="searchVisable" width="80%" mode="right">
      <view class="cearch_title">
        查询条件
      </view>
      <u-form :model="serachForm" label-position="top" label-width="auto" style="padding: 80rpx 32rpx 0 32rpx" ref="uForm">
        <template v-if="searchVisable">
          <u-form-item label="审批结果:" prop="applyResult">
            <u-radio-group v-model="serachForm.applyResult">
              <u-radio v-for="(item, index) in listResult" :key="index" :name="item.value">
                {{ item.name }}
              </u-radio>
            </u-radio-group>
          </u-form-item>
          <u-form-item label="企业字号:" prop="retailerName">
            <u-input placeholder="请输入企业字号" :border="false" v-model="serachForm.retailerName" />
          </u-form-item>
          <u-form-item label="申请开始日期:" prop="createTimeStart">
            <z-date placeholder="请选择" v-model="serachForm.createTimeStart" />
          </u-form-item>
          <u-form-item label="申请结束日期:" prop="createTimeEnd">
            <z-date placeholder="请选择" v-model="serachForm.createTimeEnd" />
          </u-form-item>
        </template>
      </u-form>
      <view class="submit-btns btn-other-cls">
        <u-button plain class="del" type="primary" @tap="handleRest">
          重置
        </u-button>
        <u-button class="mit" type="primary" @tap="selectChange">
          确定
        </u-button>
      </view>
    </u-popup>
  </view>
</template>

<script>
import { ZDate } from "@/components";
import meTable from "@/components/me-table.vue";
import fabButton from "@/components/uni-fab.vue";
import postponeAccountsItem from "../components/postponeAccountsItem.vue";
import MescrollMoreMixin from "@/components/mescroll-uni/mixins/mescroll-more.js";
import linkageService from "@/service/internal/linkeage.service";
export default {
  components: {
    ZDate,
    meTable,
    fabButton,
    postponeAccountsItem,
  },
  mixins: [MescrollMoreMixin],
  data() {
    return {
      show: true,
      searchVisable: false,
      serachForm: {
        page: 1,
        limit: 10,
        createTimeStart: "",
        createTimeEnd: "",
        retailerName: "",
        applyResult: "",
      },
      listResult: [
        {
          name: "通过",
          value: "1",
        },
        {
          name: "未通过",
          value: "0",
        },
      ],
      fContent: [
        {
          iconPath: require("@/static/search.png"),
          selectedIconPath: require("@/static/search.png"),
          text: "搜索",
          active: false,
        },
        {
          iconPath: require("@/static/add.png"),
          selectedIconPath: require("@/static/add.png"),
          text: "新增",
          active: false,
        },
      ],
    };
  },
  methods: {
    openSearch() {
      this.searchVisable = true;
    },
    selectChange() {
      if (this.serachForm.createTimeStart && this.serachForm.createTimeEnd) {
        if (new Date(this.serachForm.createTimeStart) > new Date(this.serachForm.createTimeEnd)) {
          return this.$u.toast("申请开始日期不能大于申请结束日期");
        }
      }
      this.searchVisable = false;
      this.handleReferList();
    },
    handleRest() {
      this.serachForm = {
        createTimeStart: "",
        createTimeEnd: "",
        retailerName: "",
        applyResult: "",
        page: 1,
        limit: 10,
      };
    },
    loadData(pager) {
      let self = this;
      self.serachForm.page = pager.num;
      self.serachForm.limit = pager.size;
      let param = Object.assign({}, self.serachForm);
      param.applyResult = param.applyResult ? Number(param.applyResult) : "";
      return new Promise((resolve) => {
        linkageService
          .taskDelayApplyList(param)
          .then((res) => {
            if (res.success) {
              resolve({
                data: res.data,
                count: res.count,
              });
            } else {
              self.$modal.alert(res.msg);
              resolve({
                data: [],
                count: 0,
              });
            }
          })
          .catch((err) => {
            resolve({
              data: [],
              count: 0,
            });
          });
      });
    },
    fabtrigger(btn) {
      if (btn.index == 0) {
        this.openSearch();
      } else {
        this.handleAdd();
      }
    },
    handleAdd() {
      this.$u.route({
        url: "/pages/internal/linkage/components/taskSetList",
        type: "to",
      });
    },
    updateBackState(param) {
      let self = this;
      if (param.postponeProcessing) {
        self.setRouteParam({ taskId: param.postponeProcessing.taskId, isStatus: "add" });
        self.$u.route({
          url: "/pages/internal/linkage/todo/infomationTaskSet",
          type: "to",
        });
      }

      if (param.refresh) {
        self.show = false;
        setTimeout(() => {
          self.handleReferList();
        }, 300);
      }
    },
    handleReferList() {
      this.show = true;
      let mescroll = this.getMescroll(0);
      mescroll && mescroll.triggerDownScroll();
    },
  },
};
</script>

<style lang="scss" scoped>
.page {
  padding: 0;
}

.content {
  padding: 0 24rpx;
  background: #f5f5f5;
}

.swipe-list {
  background: #ffffff;
  margin-bottom: 24rpx;
  overflow: hidden;
  border-radius: 5px;
}

.cearch_title {
  background-color: #f3f4f5;
  width: 100%;
  height: 82rpx;
  font-size: 32rpx;
  font-weight: 600;
  padding: 22rpx 0 21rpx 32rpx;
  z-index: 999;
  position: fixed;
}
</style>
